<%--
  Created by IntelliJ IDEA.
  User: 杰子
  Date: 2020/7/28
  Time: 12:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=utf-8"
         pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fun"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <c:set var="appName" value="${pageContext.request.contextPath}"></c:set>

    <meta charset="utf-8">
    <title>
        嘀嗒理财
    </title>
    <meta name="description" content="Login">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no, minimal-ui">
    <!-- Call App Mode on ios devices -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <!-- Remove Tap Highlight on Windows Phone IE -->
    <meta name="msapplication-tap-highlight" content="no">
    <!-- base css -->
    <link rel="stylesheet" media="screen, print" href="${appName}/css/vendors.bundle.css">
    <link rel="stylesheet" media="screen, print" href="${appName}/css/app.bundle.css">
    <link rel="stylesheet" media="screen, print" href="${appName}/css/notifications/sweetalert2/sweetalert2.bundle.css">

    <!-- Place favicon.ico in the root directory -->
    <link rel="apple-touch-icon" sizes="180x180" href="${appName}/img/favicon/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="${appName}/img/favicon/favicon-32x32.png">
    <link rel="mask-icon" href="${appName}/img/favicon/safari-pinned-tab.svg" color="#5bbad5">
    <!-- Optional: page related CSS-->
    <link rel="stylesheet" media="screen, print" href="${appName}/css/fa-brands.css">
    <link rel="stylesheet" media="screen, print" href="${appName}/css/fa-regular.css">

</head>
<body>
<div class="page-wrapper">
    <div class="page-inner bg-brand-gradient">
        <div class="page-content-wrapper bg-transparent m-0">
            <div class="height-10 w-100 shadow-lg px-4 bg-brand-gradient">
                <div class="d-flex align-items-center container p-0">
                    <div class="page-logo width-mobile-auto m-0 align-items-center justify-content-center p-0 bg-transparent bg-img-none shadow-0 height-9">
                        <a href="javascript:void(0)" class="page-logo-link press-scale-down d-flex align-items-center">
                            <img src="${appName}/img/logo.png" alt="Finance Bsp" aria-roledescription="logo">
                            <span class="page-logo-text mr-1">Finance Bsp</span>
                        </a>
                    </div>
                    <a href="${appName}/page_register.html" class="btn-link text-white ml-auto">
                        Create Account
                    </a>
                </div>
            </div>
            <div class="flex-1" style="background: url(${appName}/img/svg/pattern-1.svg) no-repeat center bottom fixed; background-size: cover;">
                <div class="container py-4 py-lg-5 my-lg-5 px-4 px-sm-0">
                    <div class="row">
                        <div class="col col-md-6 col-lg-7 hidden-sm-down">
                            <h2 class="fs-xxl fw-500 mt-4 text-white">
                                1111111111111111111111111111111111
                                <small class="h3 fw-300 mt-3 mb-5 text-white opacity-60">
                                    2222222222222222222222222222222222222222
                                </small>
                            </h2>
                        </div>
                        <div class="col-sm-12 col-md-6 col-lg-5 col-xl-4 ml-auto">
                            <h1 class="text-white fw-300 mb-3 d-sm-block d-md-none">
                                Secure login
                            </h1>
                            <div class="card p-4 rounded-plus bg-faded">
                                <h1 class="fw-300 mb-3 d-sm-block text-center">
                                    嘀嗒理财
                                </h1>
                                <form id="form-login" novalidate="" action="#" method="post">
                                    <div class="form-group">
                                        <label class="form-label" for="username">用户名</label>
                                        <div class="input-group bg-white shadow-inset-2">
                                            <input type="text" id="userName" name="userName" class="form-control border-right-0 bg-transparent pr-0 form-control-lg" placeholder="请输入用户名" autocomplete="new-password">
                                            <div class="input-group-append">
                                                <span class="input-group-text bg-transparent border-left-0">
                                                    <i class="far fa-times-circle phone-clear" style="cursor: pointer;color: #c9c9c9"></i>
                                                </span>
                                            </div>
                                        </div>
                                        <div class="help-block">系统唯一账号</div>
                                    </div>
                                    <div class="form-group">
                                        <label class="form-label" for="password">密码</label>
                                        <div class="input-group bg-white shadow-inset-2">
                                            <input class="form-control border-right-0 bg-transparent pr-0 form-control-lg" type="password" id="password" name="password"  placeholder="密码" autocomplete="new-password">
                                            <div class="input-group-append">
                                                        <span class="input-group-text bg-transparent border-left-0">
                                                            <i class="far fa-eye-slash pwd-toggle" style="cursor: pointer;color: #c9c9c9"></i>
                                                        </span>
                                            </div>
                                        </div>
                                        <div class="invalid-feedback">密码不能为空</div>
                                        <div class="help-block">密码</div>
                                    </div>
<%--                                    <div class="form-group text-left">--%>
<%--                                        <div class="custom-control custom-checkbox">--%>
<%--                                            <input type="checkbox" class="custom-control-input" id="rememberme">--%>
<%--                                            <label class="custom-control-label" for="rememberme"> Remember me for the next 30 days</label>--%>
<%--                                        </div>--%>
<%--                                    </div>--%>
                                    <div class="row no-gutters">
                                         <button id="btn-submit" type="button" class="btn btn-primary btn-block btn-lg">登录</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="position-absolute pos-bottom pos-left pos-right p-3 text-center text-white">
                        2019 © SmartAdmin by&nbsp;<a href='https://www.gotbootstrap.com' class='text-white opacity-40 fw-500' title='gotbootstrap.com' target='_blank'>gotbootstrap.com</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- base vendor bundle:
     DOC: if you remove pace.js from core please note on Internet Explorer some CSS animations may execute before a page is fully loaded, resulting 'jump' animations
                + pace.js (recommended)
                + jquery.js (core)
                + jquery-ui-cust.js (core)
                + popper.js (core)
                + bootstrap.js (core)
                + slimscroll.js (extension)
                + app.navigation.js (core)
                + ba-throttle-debounce.js (core)
                + waves.js (extension)
                + smartpanels.js (extension)
                + src/../jquery-snippets.js (core) -->
<script src="${appName}/js/vendors.bundle.js"></script>
<script src="${appName}/js/app.bundle.js"></script>
<script src="${appName}/js/notifications/sweetalert2/sweetalert2.bundle.js"></script>
<script src="${appName}/js/lm/lm.js"></script>

<script>
    $(document).ready(function($){

        if(!$("#userName").val() || !$("#password").val()){
            $("#btn-submit").attr("disabled",true);
        }

        $(".phone-clear").click(function () {
            $("#userName").val("").focus();
            $("#btn-submit").attr("disabled",true);
        });
        $(".pwd-toggle").click(function () {
            if($(this).hasClass("fa-eye-slash")){
                $(this).removeClass("fa-eye-slash").addClass("fa-eye");
                $("#password").attr("type","text");
            }else{
                $(this).removeClass("fa-eye").addClass("fa-eye-slash");
                $("#password").attr("type","password");
            }
        });

        $("#userName,#password").on('input propertychange',function () {
            if($("#userName").val() && $("#password").val()){
                $("#btn-submit").attr("disabled",false);
            }else{
                $("#btn-submit").attr("disabled",true);
            }
        });

        $(document).keyup(function(event){
            if(event.keyCode ==13){
                $("#btn-submit").trigger("click");
            }
        });

        $("#btn-submit").click(function(){
            if(!$("#btn-submit").attr("disabled")){
                $.common.ajaxPostJsonSuc("${pageContext.request.contextPath}/home/check",$("#form-login").serialize(),function (data) {
                    location.href= "${pageContext.request.contextPath}/";
                });
            }
        });

        $(".forget-pwd").click(function(){
            $("#login-form").attr("action","${pageContext.request.contextPath}/admin/home/forgetPwd").submit();
        });
    });
</script>
</body>
</html>
